{% extends "base.html" %}

{% block navbar %}{% endblock %}
{% block content %}
<style>
    body {
        
            margin: -0.4cm auto;
            font-size: 15px;
            font-family: Verdana, Arial, Helvetica, sans-serif;
            padding: 15px 0;
            background-image: url("../static/image/s.jpg");
            background-position: center center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
        }
        #head {
            opacity:0.85;
            width: 1100px;
            padding: 25px 15px 15px 15px;
            margin: 0 auto;
            font-size: 1.4em;
            background: #3f4b4a;
        }
    
        #title {
            opacity:0.9;
            padding: 0;
            margin: 0;
            font-size: 1.6em;
            color: #FFFFFF;
        }
    
        #title a:link,
        #title a:visited {
            background: #3f4b4a;
            text-decoration: none;
        }
    
        #date {
            float: right;
            padding: 10px 10px;
            height: 40px;
            color: #FFFFFF;
            text-align: right;
        }
    
        #content {
            opacity:0.95;
            width: 1100px;
            padding: 0 15px 1cm 15px;
            margin: 0 auto;
            background: #f5f5f5;
            color: #408080;
        }
        
        #content h1 {
            color: #74A8F5;
            /* font-family: "Trebuchet MS", Arial, Helvetica; */
            padding: 30px 0 0 0;
            margin: 0px 0 15px 0;
            font-size: 1.6em;
        }
    
        .form_table {
        
            text-align: center;
            margin-bottom: 15px;
            font-size: 1.3em;
        }
    
        .form_table th {
            opacity:0.9;
            background-color: #74A8F5;
            color: #FFFFFF;
            /*这个就可以将字体设置成白色了，将总体设成白色后再加背景就凸显出字了*/
        }
    
        .form_table td {
            background-color: #F0F8FF;
            opacity:0.9;
        }
    
        #footer {
            opacity:0.9;
            width:1100px;
            background: url(img/footer.gif) no-repeat center bottom;
            background: #3f4b4a;
            padding: 0 10px 13px 20px;
            margin: 0 auto;
        }
    
        #footer #footer_bg {
           
            padding: 15px 15px 15px 15px;
            color: #FFFFFF;  font-size: 1.4em;
        }
</style>
<body>
    
    {% if error %}
    <h5>{{ error }}</h5><br>
    {% else %}
    <script> 
        var successMessage = new bkMessage({
        message: '此页面还不太完善',
        theme: 'warning'
             });
     </script>
{% endif %}
{% if sucess %}
    <script> alert('{{ sucess }}') </script>
    <script> window.location.href="course.html"</script>
    {% else %}
    <script> 
        var successMessage = new bkMessage({
        message: '此页面还不太完善',
        theme: 'warning'
             });
     </script>
{% endif %}
<div id="wrap">
        <div id="head">
            <span id="title">
                <a href="#">用户管理</a>
            </span>
            <span id="date">
                2020/12/15
            </span>
        </div>
        <div id="content">
            <h1>
                    <a class="bk-icon-button bk-info"href="{% url 'student:index' %}" title="点击进入">
                        <i class="bk-icon icon-angle-left"></i>
                        <i class="bk-text">学生信息表</i>
                    </a>
                 
            </h1>

            <form id="i_from1" action="/select/" method="post" style="margin: 1cm 0 0 0cm;">
                {% csrf_token %}
						<table  cellspacing="7"  > 
							<tr>
								<td><input type="text" name="stu_id" id="shuru" /></td>
                                <td><input type="submit" name="usertype" value="查找" checked />
                           
                                <td> <a href="#mymodaladd2" class="bk-button bk-primary" style="font-size: 1em;"data-toggle="modal" data-target="#myModaladd2">新增</a>
                                    
							</tr>
						</table>
            </form>
            <table class="table table-bordered table7_demo">
                <thead>
                    <tr>
                        <th>学号</th>
                        <th>课程</th>
                        <th>成绩</th>
                        <th>操作</th>
                        <th>删除</th>
                    </tr>
                </thead>
                <tbody>
                    {% for status in statuses %}
                    <tr>
                        			
						         
                        <td>{{ status.cour_id }}</td>
						<td>{{ status.course }}</td>
						<td>{{ status.grade }}</td>
                        <td>
                             <form method="post" action="{{ SITE_URL }}deletecourse/">
                                {% csrf_token %}
                                <input type="hidden" name="cour_id" value={{ status.cour_id }}>
                                <input type="submit" onclick="return confirm('确认删除？');" value="删除">
                            </form>
                        </td>
                        <td>
                        </form><button data-toggle='modal' data-target='#myModal'onclick=edit("{{ status.cour_id }}")> 修改</button>
                        </td>
                    </tr>
                    
                    {% endfor %}
                </table>
     
                </tbody>
            </table>
           
        </div>
                          
        <div id="footer">
            <div id="footer_bg">
                wzl@xaut.edu.cn
            </div>
        </div>
  
        <form method="post" action="{{ SITE_URL }}updatecourse/" class="form-horizontal" role="form" name="myModal"id="myModal">
            {% csrf_token %}
            <div class="modal fade" id="myModal" name="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <!--  定义模态框，过渡效果为淡入，id为myModal,tabindex=-1可以禁用使用tab切换，aria-labelledby用于引用模态框的标题，aria-hidden=true保持模态框在触发前窗口不可见  -->
                <div class="modal-dialog">
                    <!--  显示模态框对话框模型（若不写下一个div则没有颜色）  -->
                    <div class="modal-content">
                        <!--  显示模态框白色背景，所有内容都写在这个div里面  -->
    
                        <div class="btn-info modal-header">
                            <!--  模态框标题  -->
                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                            <!--  关闭按钮  -->
                            <h4>您好，请修改</h4>
                            <!--  标题内容  -->
                        </div>
    
                        <div class="modal-body">
                            <!--  模态框内容，我在此处添加一个表单 -->
                            <form class="form-horizontal" role="form" method="post" action="Updata">
                                <div class="form-group">
                                    <label for="uname" class="col-sm-2 control-label">学号</label>
                                    <div class="col-sm-9">
                                        <input type="text" name="cour_id"readonly="readonly" class="form-control well" id="text1" placeholder="请输入学号"/>
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label for="upwd" class="col-sm-2 control-label">课程</label>
                                    <div class="col-sm-9">
                                        <input type="text" id = "course"name="course" class="form-control well" placeholder="请输入姓名"/>
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label for="upwd" class="col-sm-2 control-label">成绩</label>
                                    <div class="col-sm-9">
                                        <input type="text"id = "grade" name="grade" class="form-control well" placeholder="请输人邮箱"/>
                                    </div>
                                </div>                        
                                 <div class="modal-footer">
                            <!--  模态框底部样式，一般是提交或者确定按钮 -->
                            <input type="hidden" name="id" id="text1">                     
                            <button type="submit" class="btn btn-info"  >修改并通知</button>
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                            </form>
                        </div>
                    </div><!-- /.modal-content -->
                </div>
            </div> <!-- /.modal -->
        </form>

    <div class="modal fade" id="myModaladd2" name="myModaladd2"tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
        data-backdrop="static">
    <div class="modal-dialog" style="width: 680px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">请增加</h4>
            </div>
            <form id="myModaladd2" method="post"  name="myModaladd2">
                {% csrf_token %}
                <div class="form-group">
                    <label for="uname" class="col-sm-2 control-label">学号</label>
                    <div class="col-sm-9">
                        <input type="text"  name="cour_ida" id="cour_ida" class="form-control well" id="text1" placeholder="请输入用户名"/>
                    </div>
                </div>
                <div class="form-group">
                    <label for="upwd" class="col-sm-2 control-label">课程</label>
                    <div class="col-sm-9">
                        <input type="text" name="coursea" id="coursea"  class="form-control well" placeholder="请输入密码"/>
                    </div>
                </div>
                <div class="form-group">
                    <label for="upwd" class="col-sm-2 control-label">成绩</label>
                    <div class="col-sm-9">
                        <input type="text" name="gradea" id="gradea"  class="form-control well" placeholder="请输入密码"/>
                    </div>
                
            </form>

            <div class="modal-footer">
                <button type="button" class="bk-button bk-default" data-dismiss="modal">关闭</button>
                <button type="submit" id="saveOrg" onclick= "checkajax()" class="bk-button bk-primary">提交</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
    </div>

    
    
</div>

<script type="text/javascript">
    function edit(id){
        
            $("#text1").val(id)
        }    

       
        var key=1;
       
        //新增ajax
        function checkajax() {
            console.log($("#cour_ida").val())
         
                $.ajax({
                    url: "{{ SITE_URL }}addcourse/",
                    method: 'POST',
                    data: {
                        'posttype':"ajax",
                        'cour_ida': $("#cour_ida").val(),
                        'coursea': $('#coursea').val(),
                        'gradea': $('#gradea').val(),
               
                        'csrfmiddlewaretoken': "{{ csrf_token }}"
                    },
                    dataType: 'JSON',
                    success: function (response) {
                        console.log(66)
                      
                        if (response['result']) {
                            alert("成功！");
                            location.reload()
                            $('#myModaladd2').modal('hide')

                            new bkMessage({
                                message: response['message'],
                                theme: 'success'
                            })
                            
                             //orgTable.ajax.reload(null, false)
                        } else {
                            // 失败处理
                            alert("不存在的学号");
                            new bkMessage({
                                message: response['message'],
                                theme: 'error',
                                delay: 3000
                            });
                            
                            //$('#myModaladd2').modal('hide')
                            // orgTable.ajax.reload(null, false)
                        }
                    }
                })
            }



    //修改


    </script>
<!-- <a href="/student/login/">登录</a><br> -->

</body>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
{% endblock %}